<template>
  <view class="upgrade-top">
    <u-steps :current="current" activeColor="#01ADA8" inactiveColor="#BFBFBF">
      <u-steps-item title="填写资料" class="selectitem-color"> </u-steps-item>
      <u-steps-item title=" 协议签定"></u-steps-item>
      <u-steps-item title="缴费"></u-steps-item>
      <u-steps-item title="审核中"></u-steps-item>
    </u-steps>
  </view>
</template>

<script setup>
import { ref, reactive, computed, watch } from "vue";
import { onShow } from "@dcloudio/uni-app";
const props = defineProps({
  current: {
    type: Number,
    default: () => {
      return 0;
    },
  },
});
</script>

<style scoped lang="scss">
.upgrade-top {
  width: 702rpx;
  //   height: 184rpx;
  background: #ffffff;
  border-radius: 20rpx 20rpx 20rpx 20rpx;
  margin: 0 auto;
  padding-top: 40rpx;
  padding-bottom: 40rpx;
  padding-left: 30rpx;
  padding-right: 30rpx;
  box-sizing: border-box;
}
.upgrade-top-title {
  font-size: 28rpx;
  font-weight: bold;
  color: #333333;
  line-height: 40rpx;
  text-align: left;
  margin-bottom: 20rpx;
}
.upgrade-top-content {
  font-size: 24rpx;
  font-weight: 400;
  color: #666666;
  //   ::v-deep .u-steps-item__wrapper__circle {
  //   }
  //   ::v-deep .u-steps-item__wrapper__circle {
  //     width: 40rpx;
  //     height: 40rpx;
  //   }

  ::v-deep .u-text__value {
    font-weight: bold;
    font-size: 28rpx;
    color: #01ada8;
    line-height: 48rpx;
    text-align: left;
  }
  .selectitem-color {
    color: red;
  }
}
</style>
